<template>
<view>
	<view class="list_sort">
	    <view @click="selectCate(1)" class="sort_right" :class="{select_true : type == 1}">
			商品
	    </view>
	    <view @click="selectCate(2)" class="sort_right" :class="{select_true : type == 2}">
	        机构
	    </view>
	    <view @click="selectCate(3)" class="sort_right" :class="{select_true : type == 3}">
	        简历
	    </view>
	    <view @click="selectCate(4)" :class="{select_true : type == 4}">
	        厂商
	    </view>
	</view>
	<view class="list" v-for="(item,index) in list" :key="index">
		<view class="list_left" @click="jump(item.rid,item.uid)">
			<image :src="item.img"></image>
		</view>
		<view class="list_right">
			<view class="list_item" @click="jump(item.id,item.uid)">
				<view class="name">{{item.name}}</view>
				<view class="time">{{item.addtime}}</view>
			</view>
			<view class="list_item top">
				<view>{{item.remark}}</view>
				<view class="del" @click="del(item.id,index)">删除</view>
			</view>
		</view>
	</view>
</view>
</template>
<script>
import request from '@/util/request.js'
export default {
	data() {
		return{
			imgUrl:this.url,
			list:[],
			page:1,
			pageShow:true,
			type:1
		}
	},
	onLoad:function(){
		uni.showLoading({
		    title: '加载中'  
		});
		this.getlist();
	},
	methods: {
		getlist:function(){
			var that = this;
			var data = {
				uid:uni.getStorageSync('uid'),
				page:this.page,
				type:this.type
			}
			request({
				url: 'collection/list',
				method: 'get',
				data:data,
				success: (res) => {
					uni.hideLoading();
					if(res.data.code == 1){
						if(res.data.data.last_page <= that.page){
							that.pageShow = false
						}
						if(that.page == 1){
							that.list = res.data.data.data
						}else{
							var list = that.list
							that.list = list.concat(res.data.data.data)
						}
					}
				}
			})
		},
		onReachBottom: function(){
			if(this.pageShow){
				 //当前不是最后一页可加载
				 this.page = this.page + 1
				 uni.showLoading()
				 this.getlist();
			}
		},
		selectCate:function(key){
			if(key == 3 || key == 4){
				if(uni.getStorageSync('role') !== 3){
					uni.showToast({
						title: '暂无权限!!!',
						icon: "none", 
						position:'bottom',
					});
					return;
				}
			}
			this.type = key
			this.page = 1
			this.pageShow = true
			uni.showLoading()
			this.getlist();
		},
		del:function(id,index){
			var data = {id:id}
			var that = this
			request({
				url: 'collection/delete',
				method: 'delete',
				data:data,
				success: (res) => {
					if(res.data.code == 1){
						uni.showToast({
							title: '删除成功!!!',
							icon: "success", 
							position:'bottom',
						});
						that.list.splice(index,1)
					}else{
						uni.showToast({
							title: '删除失败!!!',
							icon: "none", 
							position:'bottom',
						});
					}
				}
			})
		},
		jump:function(id,uid){
			if(uni.getStorageSync('role') == 1){
				uni.showToast({
					title:'暂未注册!',
					icon: 'none',
					duration: 2000,
					success() {
						setTimeout(function() {
							uni.navigateTo({
								url:'/pages/login/index'
							});
						}, 2000);
					}
				})
				return;
			}
			if(this.type == 1){
				uni.showToast({
					title: '暂未开放!!!',
					icon: "none", 
					position:'bottom',
				});
				return;
			}
			if(this.type == 2){
				var url = "/pages/company/info?id="+id
			}
			if(this.type == 3){
				var url = "/pages/job/info?uid="+uid
			}
			if(this.type == 4){
				var url = "/pages/factory/info?id="+id
			}
			uni.navigateTo({
				url:url
			});
		}
	}
}
</script>
<style>
.list_sort{
    display: flex;
	flex-direction: row;
    width: 100%;
    height: 80rpx;
	line-height: 80rpx;
	border-bottom: 1rpx solid #000000;
}
.list_sort view{
	text-align: center;
	width:25%;
}
.select_true{
	border-bottom: 3px solid #ff1a1a;
}
.sort_right {
    border-right: 1px solid #ececec;
}
.list{
	display: flex;
	flex-direction: row;
	padding: 10rpx 10rpx 10rpx 10rpx;
	border-bottom: 1rpx solid #ececec;
}
.list_left{
	width:30%;
	text-align:center;
	align-items: center;
}
.list_left image{
	width:180rpx;
	height:180rpx;
	border-radius: 50%;
}
.list_right{
	width:70%;
	display: flex;
	flex-direction: column;
	padding-top:30rpx;
}
.list_item{
	display: flex;
	flex-direction: row;
	justify-content: space-between;
}
.top{
	margin-top:30rpx;
}
.name{
	font-weight: bold;
}
.time{
	font-size:11px;
	font-weight: normal;
}
.del{
	color: #fff;
	font-size:11px;
	background:#b30000;
	width:150rpx;
	height:50rpx;
	line-height:50rpx;
	border-radius: 10rpx;
	text-align: center;
}
</style>